<template>
  <div style="min-width: 300px;width: 100%;">
    <div v-if="device.array">
      <el-form>
        <el-form-item :label="$t('All')">
          <el-switch v-model="powerAll" :active-text="$t('device.PullOpen')" :inactive-text="$t('device.Closure')"
            v-on:change="handleChangeEach($event)"></el-switch>
        </el-form-item>
      </el-form>
      <el-form inline>
        <el-form-item v-for="(item,index) in device.array" :key="'curtain_'+index" :label="item.devNames">
          <el-button :type="buttonTypeByDevice(item)" v-on:click="handleChange(item,0)" :disabled="!item.online"
            class="button-fixed">
            {{ $t('device.PullOpen') }}</el-button>
          <el-button :type="buttonTypeByDevice(item)" v-on:click="handleChange(item,1)" :disabled="!item.online"
            class="button-fixed">
            {{ $t('device.Closure') }}</el-button>
          <el-button :type="buttonTypeByDevice(item)" v-on:click="handleChange(item,2)" :disabled="!item.online"
            class="button-fixed">
            {{ $t('Stop') }}
          </el-button>
        </el-form-item>
      </el-form>
    </div>
    <div v-else style="display: flex;justify-content: space-around;align-content: center; padding-top: 20px;">
      <el-button :type="buttonType" v-on:click="handleChange(device,0)" :disabled="!device.online" class="button-fixed">
        {{ $t('device.PullOpen') }}
      </el-button>
      <el-button :type="buttonType" v-on:click="handleChange(device,1)" :disabled="!device.online" class="button-fixed">
        {{ $t('device.Closure') }}</el-button>
      <el-button :type="buttonType" v-on:click="handleChange(device,2)" :disabled="!device.online" class="button-fixed">
        {{ $t('Stop') }}
      </el-button>
    </div>
  </div>
</template>
<script>
  import BaseController from './BaseController'
  export default {
    name: 'CurtainController',
    mixins: [BaseController],
    data() {
      return {
        powerAll: false,
        powerOn: []
      }
    },
    methods: {
      setItemDevice(device) {
        if (undefined === device) {
          this.$set(device, 'checkOn', false)
        }
        // if (device.code.indexOf('RF_RELAY')) {}
        // if (device.stateJson && each.stateJson.POWER !== undefined) {
        //   this.powerOn[i] = each.stateJson.POWER === 'ON'
        // }
        // if (this.powerOn[i] === undefined) {
        //   this.powerOn[i] = false
        // }
      },
      setPowerAll() {
        const list = powerOn
        var powerOn = true
        for (var i = 0; i < list.length; i++) {
          const each = list[i]
          if (each === false) {
            powerOn = false
            break
          }
        }
        if (powerOn) {
          this.powerAll = true
        }
        var powerOff = true
        for (var i = 0; i < list.length; i++) {
          const each = list[i]
          if (each === true) {
            powerOff = false
            break
          }
        }
        if (powerOff) {
          this.powerAll = false
        }
      },
      handleChange(device, state) {
        const actions = [this.$t('device.PullOpen'), this.$t('device.Closure'), this.$t('Stop')]
        const action = actions[state]
        const code = device.code
        var command = null
        var message = null
        if (code.indexOf('CRT_RELAY_') >= 0) {
          const power1 = "Power3 off;Power2 on;Delay 1;Power2 off;Delay 1;Power1 on;Delay 1;Power1 off";
          const power2 = "Power3 off;Power1 on;Delay 1;Power1 off;Delay 1;Power2 on;Delay 1;Power2 off";
          const stop = "Power3 on;Delay 1;Power3 off;"
          const messages = [power1, power2, stop]
          if ((device.mode === 7) !== onOff) {
            messages[0] = power2
            messages[1] = power1
          }
          command = 'Backlog'
          message = messages[state]
        } else if (code.indexOf('BleGate_') >= 0) {
          command = "control"
          const messages = [{
              "Position": 0
            },
            {
              "Position": 100
            },
            {
              "STOP": 1
            }
          ]
          const DATA = {
            "PackageType": 0,
            "DeviceControl": {
              "DevMac": code.split('@').pop(),
              "Message": messages[state]
            }
          }
          message = JSON.stringify(DATA)
        } else {
          throw new Error('curtain code is not start with CRT_RELAY_ / BleGate_ : ' + code);
        }
        this.doCommand(code, command, message, action);
      },
      handleChangeEach(state) {
        const list = this.device.array
        for (var i = 0; i < list.length; i++) {
          setTimeout(this.handleChange, 1000 * i, list[i], state ? 0 : 1)
        }
      }
    }
  }

</script>
